<template>
  <div class="UpdatePassword">
    <van-nav-bar
        title="重置密码"
        left-text=""
        left-arrow
        @click-left="onClickLeft"
    />
    <van-form validate-first>
      <van-field
          v-model="map.oldPwd"
          name="validator"
          placeholder="请输入原来的密码"
          type="password"
          :rules="[{ required:true }]"
      />
      <!-- 通过 validator 进行异步函数校验 -->
      <van-field
          v-model="map.newPwd"
          name="asyncValidator"
          placeholder="请输入新密码"
          type="password"
          :rules="[{ required:true }]"
      />
      <div style="margin: 16px">
        <van-button
            round
            block
            type="info"
            native-type="submit"
            @click="SubmitBtn"
        >提交
        </van-button
        >
      </div>
    </van-form>
  </div>
</template>

<script>
import {Toast} from "vant";
import {mapGetters, mapActions} from 'vuex'

export default {
  name: "UpdatePassword",
  computed: {
    ...mapGetters(['loginUserInfo']),
  },
  mounted() {
  },
  data() {
    return {
      map: {
        // phone: "",
        oldPwd: "",
        newPwd: "",
      },
    };
  },
  methods: {
    onClickLeft() {
      this.$router.push("/MyMessageSetting");
    },
    //提交修改密码
    SubmitBtn() {
      if (this.map.newPwd && this.map.oldPwd) {
        this.$dialog
            .confirm({
              title: "确认修改密码",
              message: "请确认是否修改当前密码？",
            })
            .then(() => {
              this.$service.myService.updatePassword(this.map).then(res => {
                if (res.data.code == 200) {
                  Toast.success('修改成功');
                  this.$router.push('/');
                } else {
                  Toast.fail('密码修改失败！');
                }
              })
            })
            .catch(() => {
              // on cancel
            });
      }
    },
  },
};
</script>

<style>
</style>
